<template>
    <div class="subpage" v-if="film">
        <my-head :title="film.name"></my-head>
        <van-tabs v-model="active"  color="#ff5f16" title-active-color="#ff5f16" sticky >
            <van-tab :name="i" :title="l.showDate * 1000 | dateFormat2(i)" v-for="(l,i) in showCinemas" :key="i">
                <mlist :list="cinemas" :filmId="film.filmId" :date="showCinemas[active].showDate" ></mlist>
            </van-tab>
        </van-tabs>
        
    </div>
</template>

<script>
export default {
    data(){
        return {
            active:0,
            film:null,
            showCinemas:[],
            cinemas:[]
        }
    },
    watch:{
        active(v){
            console.log(v)
            this.getCinemas(this.showCinemas[v].cinemaList)  // 请求那一天电影影院数据
       }
    },
    methods:{
        arrAse(a,b){
            return a['showDate'] - b['showDate']  
            // return b['showDate'] - a['showDate'] 降序

        },
        async getFilm(){
            let res = await this.$ajax.getMZdata({
                filmId:this.$route.params.filmId
            },{
                'X-Host': 'mall.film-ticket.film.info'
            })
            this.film = res.data.film
        },
        async getshowCinemas(){
            let res = await this.$ajax.getMZdata({
                filmId:this.$route.params.filmId,
                cityId:this.city.cityId,
            },{
                'X-Host': 'mall.film-ticket.cinema.film-show-cinema'
            })
            // 排序 

            this.showCinemas = res.data.showCinemas.sort(this.arrAse)
            this.getCinemas(this.showCinemas[this.active].cinemaList)
        },
        async getCinemas(cinemas){
            let res = await this.$ajax.postMZdata({
                cityId:this.city.cityId,
                cinemaIds:cinemas.join(",")
            },{

            },{
                'X-Host': 'mall.film-ticket.cinema.batch-cinema'
            })
            this.cinemas = res.data.cinemas

        }
    },
    mounted(){
        this.getFilm()
        this.getshowCinemas()
    }
}
</script>